<template>
  <div class="login">
    <div class="login-left">
      <img src="../../assets/image/login-left.png" alt="" />
    </div>
    <div class="login-right display-flex alig center">
      <div class="login-info"></div>
    </div>
  </div>
</template>

<script setup>
import { useStore } from "../../store/index";
const { count } = useStore();
</script>

<style lang="scss" scoped>
.login {
  width: 100vw;
  height: 100vh;
  // background-color: red;
  overflow: hidden;
  display: flex;
  .login-left {
    width: 14.2rem;
    height: 100vh;
    > img {
      width: 100%;
    }
  }
  .login-right {
    flex: 1;
    background: url("../../assets/image/login-right.png") 100% 100%;
    .login-info {
      width: 6.0125rem;
      height: 7rem;
      background: #ffffff;
      box-shadow: 0px 17px 36px 1px rgba(23, 129, 222, 0.25);
      border-radius: 0.25rem;
      opacity: 1;
    }
  }
}
</style>
